<template>
  <div class="main">
    <el-row>
      <el-col :span="12" :offset="3">
        <el-form label-position="left">
          <el-form-item>
            <el-input v-model.trim="customer.mobile" style="width: 250px">
              <template slot="prepend">客服电话</template>
            </el-input>
          </el-form-item>
        </el-form>
      </el-col>
      <el-col :span="12" style="display: flex;justify-content: flex-end">
        <el-button type="primary" @click="setActivityCustomer">保存</el-button>
      </el-col>
    </el-row>
  </div>
</template>
<script>
  export default {
    data () {
      return {
        customer: {
          mobile: ''
        }
      }
    },
    methods: {
      /**
       * @purpose 获取比例
       */
      getActivityCustomer () {
        this.showLoading()
        this
          .$api
          .configure
          .getActivityCustomer()
          .then(r => {
            if (r instanceof Object && typeof r.mobile !== 'undefined') {
              this.customer = r
            }
          })
      },
      /**
       * @purpose 设置比例
       */
      setActivityCustomer () {
        this.showLoading()
        this
          .$api
          .configure
          .setActivityCustomer(this.customer)
          .then(r => {
            this.toast('设置成功')
          })
      }
    },
    created () {
      this.getActivityCustomer()
    }
  }
</script>
<style scoped lang="sass">
  .el-col
    margin: 1rem 0 1rem 12.5%
    padding: 1rem
    background-color: #ffffff
    border-radius: 5px
    position: relative
</style>
